<template>
  <p-modal
    v-model="visible"
    :confirm-loading="confirmLoading"
    :mask-closable="false"
    :width="600"
    :title="title"
    @cancel="onCancel"
    @ok="onOk"
  >
    <p-form-model ref="form" :model="model" :rules="rules" :label-col="{span: 6}" :wrapper-col="{span: 17}" label-align="right">
      <p-form-model-item label="异常类型" prop="exceptionType">
        <p-select v-model="model.exceptionType" allow-clear>
          <p-select-option
            v-for="item in typeOptions"
            :key="item.value"
            :value="item.value"
          >{{ item.text }}</p-select-option>
        </p-select>
      </p-form-model-item>
      <p-form-model-item label="异常步骤" prop="exceptionStep">
        <p-select v-model="model.exceptionStep" allow-clear>
          <p-select-option
            v-for="item in stepOptions"
            :key="item.value"
            :value="item.value"
          >{{ item.text }}</p-select-option>
        </p-select>
      </p-form-model-item>
      <p-form-model-item label="车间" prop="workshop">
        <p-select v-model="model.workshop" allow-clear>
          <p-select-option
            v-for="item in stepOptions"
            :key="item.value"
            :value="item.value"
          >{{ item.text }}</p-select-option>
        </p-select>
      </p-form-model-item>
      <p-form-model-item label="部门" prop="notifyDepart">
        <JSelectDepart v-model="model.notifyDepart" style="height: 32px;" />
      </p-form-model-item>
      <p-form-model-item label="通知人员" prop="notifyPeople">
        <SelectUserByDepart v-model="model.notifyPeople" :depart-id="model.notifyDepart" />
      </p-form-model-item>
      <p-form-model-item label="推送方式" prop="pushType">
        <p-select v-model="model.pushType" allow-clear>
          <p-select-option
            v-for="item in pushTypeOptions"
            :key="item.value"
            :value="item.value"
          >{{ item.text }}</p-select-option>
        </p-select>
      </p-form-model-item>
      <p-form-model-item label="是否异常升级" prop="exceptionUpgrade">
        <p-switch :checked="!!model.exceptionUpgrade" @change="setExceptionUpgrade" />
      </p-form-model-item>
      <p-form-model-item v-show="model.exceptionUpgrade === 1" label="异常升级时间" prop="exceptionUpgradeTime">
        <p-input-number v-model="model.exceptionUpgradeTime" /> 分钟
      </p-form-model-item>
      <p-form-model-item v-show="model.exceptionUpgrade === 1" label="异常升级有效时效" prop="exceptionUpgradeEffectTime">
        <p-range-picker
          v-model="model.exceptionUpgradeEffectTime"
          :show-time="{ format: 'HH:mm' }"
          format="HH:mm"
        />
      </p-form-model-item>
      <p-form-model-item v-show="model.exceptionUpgrade === 1" label="异常升级推送人员" prop="exceptionUpgradePushPeople">
        <JSelectUserByDep v-model="model.exceptionUpgradePushPeople" :user="upgradeUserName" />
      </p-form-model-item>
    </p-form-model>
  </p-modal>
</template>

<script>
import modalMixin from '@/mixins/modalMixin'
import { getAction, postAction, putAction } from '@/api/manage'

export default {
  mixins: [modalMixin],
  components: {
    JSelectDepart: () => import('@/components/jeecgbiz/JSelectDepart'),
    JSelectUserByDep: () => import('@/components/jeecgbiz/JSelectUserByDep'),
    SelectUserByDepart: () => import('./selectUserByDepart'),
  },
  props: {
    selected: {
      type: Array,
      default: () => []
    },
    typeOptions: {
      type: Array,
      required: true
    },
    stepOptions: {
      type: Array,
      required: true
    },
    pushTypeOptions: {
      type: Array,
      required: true
    },
  },
  data() {
    return {
      model: {
        id: '',
        exceptionType: '',
        exceptionStep: '',
        workshop: '',
        notifyDepart: '',
        pushType: '',
        exceptionUpgrade: '',
        exceptionUpgradeEffectTime: '',
        exceptionUpgradePushPeople: '',
        exceptionUpgradeTime: '',
        notifyPeople: []
      },
      rules: {
        exceptionType: {
          required: true,
          message: '请选择异常类型',
        },
        exceptionStep: {
          required: true,
          message: '请选择异常步骤',
        },
        workshop: {
          required: false,
          message: '请选择车间',
        },
        notifyDepart: {
          required: true,
          message: '请选择部门',
        },
        notifyPeople: {
          required: true,
          validator: (rules, value) => {
            return !!value.length
          },
          message: '请选择通知人员',
        },
        pushType: {
          required: true,
          message: '请选择推送方式',
        },
        exceptionUpgradeTime: {
          required: false,
          message: '请选择异常升级时间'
        },
        exceptionUpgradeEffectTime: {
          required: false,
          message: '请选择异常升级有效时段'
        },
        exceptionUpgradePushPeople: {
          required: false,
          message: '请选择异常升级推送人员'
        },
      },
      upgradeUserName: '',
    }
  },
  computed: {
    title() {
      return this.options && this.options.id ? '编辑异常推送规则' : '添加异常推送规则'
    }
  },
  methods: {
    initValue() {
      this.visible = this.value
      if (this.visible) {
        if (this.options && this.options.id) {
          this.fillModel(this.options.id)
        } else {
          this.resetModel()
        }
      }
    },
    onCancel() {
      this.visible = false
    },
    onOk() {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.confirmLoading = true
          const data = Object.assign({}, this.model)
          const notifyPeople = [] 
          data.notifyPeople && data.notifyPeople.forEach(item => {
            notifyPeople.push(item.userCode)
          })
          data.notifyPeople = notifyPeople.join(',')
          data.exceptionUpgrade = data.exceptionUpgrade ? 1 : 0
          let func = postAction
          let message = '新增成功'
          if (this.model.id) {
            func = putAction
            message = '修改成功'
          }
          func('/mes-manufacture/mesMfProductExceptionPushSet', data).then(res => {
            this.confirmLoading = false
            if (res.data) {
              this.$message.success(message)
              this.$emit('success')
              this.visible = false
              this.$refs.form.resetFields()
            } else {
              this.$message.warning(res.msg)
            }
          })
        }
      })
    },
    fillModel(id) {
      getAction(`/mes-manufacture/mesMfProductExceptionPushSet/${id}`).then(res => {
        if (res.data) {
          const ids = []
          const names = []
          if (res.data.exceptionUpgradePushPeople) {
            res.data.exceptionUpgradePushPeople.forEach(item => {
              ids.push(item.userCode)
              names.push(item.userName)
            })
          }
          res.data.exceptionUpgradePushPeople = ids.join(',')
          res.data.exceptionUpgrade = res.data.exceptionUpgrade ? 1 : 0
          this.upgradeUserName = names.join(',')
          Object.assign(this.model, res.data)
          this.setExceptionUpgrade(res.data.exceptionUpgrade)
        } else {
          this.resetModel()
        }
      })
    },
    resetModel() {
      for (let key in this.model) {
        if (key === 'notifyPeople') {
          this.model[key] = []
        } else {
          this.model[key] = ''
        }
      }
      this.setExceptionUpgrade(0)
    },
    setExceptionUpgrade(checked) {
      this.model.exceptionUpgrade = checked ? 1 : 0
      const keys = ['exceptionUpgradeEffectTime', 'exceptionUpgradePushPeople', 'exceptionUpgradeTime']
      if (!checked) {
        this.model.exceptionUpgradeEffectTime = ''
        this.model.exceptionUpgradePushPeople = ''
        this.model.exceptionUpgradeTime = ''
        this.upgradeUserName = ''
      }
      keys.forEach(key => {
        this.rules[key].required = !!checked
      })
    }
  }
}
</script>
